<template>
  <div class="data-wrap">
    <van-collapse v-model="block1">
      <van-collapse-item name="1">
        <template #title>
          <div class="data-title"><i /><span>历史曲线</span></div>
        </template>
        没有更多数据
      </van-collapse-item>
    </van-collapse>

    <van-collapse v-model="block2">
      <van-collapse-item name="1">
        <template #title>
          <div class="data-title"><i /><span>历史数据</span></div>
        </template>
        没有更多数据
      </van-collapse-item>
    </van-collapse>
  </div>
</template>
<script>
export default {
  data() {
    return {
      block1: ["1"],
      block2: ["1"]
    };
  },
  methods: {}
};
</script>

<style scoped lang="scss">
.data-wrap {
  padding: 20px 30px;
}
.data-title {
  display: flex;
  align-items: center;
  i {
    width: 6px;
    height: 30px;
    background: #4f93f9;
    border-radius: 3px;
    margin-right: 26px;
  }
  span {
    font-size: 30px;
    color: #333;
  }
}
.van-collapse {
  margin-bottom: 20px;
}
</style>
<style lang="scss">
.data-wrap {
  .van-cell {
    padding: 20px 30px;
  }
}
</style>
